<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="科目列表" width="400px" @ok="handleSubmit">
    <div style="font-size:18px;color:#000;padding-left: 20px">当前人员：{{name}}</div>
    <BasicTable @register="registerTable"  :rowSelection="rowSelection">
        <!--操作栏-->
      <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" />
      </template>
    </BasicTable>
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { ref, unref } from 'vue';
  import { toRaw } from '@vue/reactivity';
  import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
  import { BasicTable, useTable, TableAction } from '/src/components/Table';
  import { useDesign } from '/@/hooks/web/useDesign';
  import { useListPage } from '/@/hooks/system/useListPage'

   import {payDetailColumns, searchFormSchema} from '../CsCoursePayOrder.data';
  import {payDetail} from '../CsCoursePayOrder.api';
  import { ColEx } from '/@/components/Form/src/types';
  import { useMessage } from '/@/hooks/web/useMessage';
  const $message = useMessage();

  // const { prefixCls } = useDesign('row-invalid');
  const orderId= ref('');
  const name = ref('');
  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
    orderId.value = data.id;
    name.value = data.name;
    showFooter.value = data?.showFooter ?? true;
    setDrawerProps({ confirmLoading: false, showFooter: showFooter.value });
    setProps({ searchInfo: { payId: unref(orderId) } });
    reload();
  });
  const { tableContext,onExportXls,onImportXls } = useListPage({
      tableProps:{
           title: '科目订单',
           api: payDetail,
           columns :payDetailColumns,
           canResize:false,
           rowKey:'id',
           showActionColumn:false,
           useSearchForm:false,
           formConfig: {
              labelWidth: 65,
              autoSubmitOnEnter:true,
              showAdvancedButton:true,
              fieldMapToNumber: [
              ],
              fieldMapToTime: [
              ],
            },
           actionColumn: {
               width: 120,
               fixed:'right'
            },
      },
     
  })
  const [registerTable, {reload,getForm,setProps},{ rowSelection, selectedRowKeys }] = tableContext


  const showFooter = ref(true);

 /**
      * 操作栏
      */
  function getTableAction(record){
       return [
         
       ]
   }

  //提交事件
  async function handleSubmit() {
    try {
      closeDrawer();
      //刷新列表
      // emit('success',{isUpdateVal ,values});
    } finally {
      setDrawerProps({ confirmLoading: false });
    }
  }

  /**
    * 成功回调
    */
  function handleSuccess() {
      (selectedRowKeys.value = []) && reload();
   }
</script>
<style scoped lang="less">
  @prefix-cls: ~'@{namespace}-row-invalid';

  :deep(.@{prefix-cls}) {
    background: #f4f4f4;
    color: #bababa;
  }
</style>
